<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib prefix="security" uri="http://www.springframework.org/security/tags" %>
<%@ taglib prefix="sf" uri="http://www.springframework.org/tags/form" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Insert title here</title>

    <script type="text/javascript" src="../../resources/js/jquery-1.6.js"></script>
    <script type="text/javascript" src="../../resources/js/jquery.form.js"></script>
    <script type="text/javascript" src="../../resources/js/jquery-validation-1.8.0/jquery.validate.js"></script>
    <script type="text/javascript" src="../../resources/js/jquery-validation-1.8.0/additional-methods.js"></script>
    <script type="text/javascript" src="../../resources/js/jquery-ui-1.8.11.custom.min.js"></script>
    <script type="text/javascript" src="../../resources/js/jquery-ui-timepicker-addon.js"></script>
    <link rel="stylesheet" type="text/css" media="screen" href="../../resources/css/start/jquery-ui-1.8.10.custom.css"/>
    <style type="text/css">
        .ui-timepicker-div .ui-widget-header {
            margin-bottom: 8px;
        }

        .ui-timepicker-div dl {
            text-align: left;
        }

        .ui-timepicker-div dl dt {
            height: 25px;
        }

        .ui-timepicker-div dl dd {
            margin: -25px 0 10px 65px;
        }

        .ui-timepicker-div td {
            font-size: 90%;
        }
    </style>

    <script type="text/javascript">
        $(document).ready(function() {

            $("#messageForm").validate({
                        submitHandler: function(form) {
                            $(form).ajaxSubmit({
                                        success: function(data) {
                                            if ($.parseJSON(data[0]).isOk) {
                                                if (self!=top) {
                                                    window.parent.closeIframe(false);
                                                } else {
                                                    window.location="/messages";
                                                }
                                            } else {
                                                alert("Не удалось отправить сообщение");
                                            }
                                        }
                                    })
                        },
                        rules:{
                            receiver: {
                                required: true
                            },
                            subject: {
                                required : true,
                                maxlength : 128
                            },
                            text: {
                                required: true,
                                maxlength : 512
                            }
                        },
                        messages: {
                         receiver: {
                                required: "Это поле обязательно для заполнения"
                            },
                            subject: {
                                required: "Это поле обязательно для заполнения",
                                maxlength : "Тема не должна превышать 128 символов"
                            },
                            text: {
                                required: "Это поле обязательно для заполнения",
                                maxlength : "Сообщение не должно превышать 512 символов"
                            }
                        }
                    });
        })

    </script>

</head>
<body>

<sf:form action="/messages/send" modelAttribute="message" id="messageForm" method="post">
    <table>
        <tr>
            <td>
                Получатель:
            </td>
            <td>
                <input type="text" readonly="true" value="${message.receiver.firstName} ${message.receiver.lastName}"/>
                <sf:input hidden="hidden" id="receiver" path="receiver" value="${message.receiver.email}" />
                <sf:input hidden="hidden" id="sender" path="sender" value="${message.sender.email}" />
            </td>
        </tr>
        <tr>
            <td>
                Тема:
            </td>
            <td>
                <sf:input path="subject" type="text" name="subject"/>
                <sf:errors path="subject" />
            </td>
        </tr>
        <tr>
            <td>
                Сообщение:
            </td>
            <td>
                <sf:textarea path="text"/>
                <sf:errors path="text"/>
            </td>
        </tr>
        <tr>
            <td><input type="submit" value="Отправить"/></td>
        </tr>
    </table>
</sf:form>

</body>
</html>